<template>
  <div class="app-container dateInput">
    <!--<multistation-choose-column></multistation-choose-column>-->
    <el-row :gutter="20" style="margin:0px -20px;height: 100%;">
      <el-col :span="5" style="padding:0px;  height: 100%">
        <!-- 组织机构树 -->
        <div class="zztree">
          <div slot="header" class="clearfix zztree-title" style="padding-top:0;line-height:23px;">
            <span>组织机构树</span>
          </div>
          <div class="zztree-con overflow_yAuto trees">
            <el-tree ref='tree' :data="treeData" :props="defaultProps" v-loading="loading" @node-click="handleNodeClick"
              :expand-on-click-node='false' node-key="id" :highlight-current='true' :default-expand-all='true'>
            </el-tree>
          </div>
        </div>
      </el-col>
      <el-col :span="11" style="padding:0px;height: 100%;">
        <div class="job-tab">
          <div slot="header" class="clearfix job-tab-header" style="height:35px">
            <span>站点列表</span>

            <el-button class="filter-item p-l" size="small" style="" type="primary" icon="el-icon-circle-plus-outline"
              @click="handleCreate">新建</el-button>

          </div>
          <div>

            <el-tabs v-model="activeName" type="card" style="border: 1px #eeeeee solid;" @tab-click="tabClick">
              <el-tab-pane name="newspaper" label="报纸">
                <span slot="label"><i class="el-icon-date"></i> 报纸</span>
                <template v-if="activeName === 'newspaper'">
                  <multistation-newspaper-list :operatingAgencynames="selectItem.orgName" :org="selectItem.selectOuinfoId"
                    @handlemodulesclick="handlemodulesclick"></multistation-newspaper-list>
                </template>
              </el-tab-pane>
              <el-tab-pane name="app" label="APP">
                <template v-if="activeName === 'app'">
                  <multistation-app-list :org="selectItem.selectOuinfoId" @handlemodulesclick="handlemodulesclick"></multistation-app-list>
                </template>
              </el-tab-pane>
              <el-tab-pane name="weChat" label="微信">
                <template v-if="activeName === 'weChat'">
                  <multistation-weChat-list :org="selectItem.selectOuinfoId" @handlemodulesclick="handlemodulesclick"></multistation-weChat-list>
                </template>
              </el-tab-pane>
              <el-tab-pane name="microBlog" label="微博">
                <template v-if="activeName === 'microBlog'">
                  <multistation-microBlog-list :org="selectItem.selectOuinfoId" @handlemodulesclick="handlemodulesclick"></multistation-microBlog-list>
                </template>
              </el-tab-pane>
              <el-tab-pane name="website" label="网站">
                <template v-if="activeName === 'website'">
                  <multistation-website-list :org="selectItem.selectOuinfoId" @handlemodulesclick="handlemodulesclick"></multistation-website-list>
                </template>
              </el-tab-pane>
            </el-tabs>
          </div>
        </div>
      </el-col>
      <el-col :span="4">
        <div class="clearfix job-tab-header">
          <span style="margin-left:8px">模块列表</span>

          <i class="el-icon-circle-plus-outline p-l" style="color:gray;margin-right:15px" title="添加" @click="modulesCreate"></i>
          <i class="el-icon-share p-l" style="margin-right:10px" title="分享" @click.stop="sharedataone(item)"></i>
        </div>
        <div class="list-content">
          <div :class="{active:item.active,'list-item':true}" v-for="item in moduleslist" :key="item.id" @click="handleColumnClick(item)">
            <div class="list-title">{{item.name}}</div>
            <div class="lists">
              <i class="el-icon-tickets" v-if="activeName === 'newspaper'" title="复制" @click.stop="copyModule(item)"></i>
              <i class="el-icon-edit" title="编辑" @click.stop="updatemodulesdata(item)"></i>
              <i class="el-icon-delete" title="删除" @click.stop="deletemodulesdata(item.id)"></i>
            </div>
          </div>
        </div>
      </el-col>
      <el-col :span="4">
        <div class="clearfix job-tab-header">
          <span style="margin-left:8px">栏目列表</span>
          <i class="el-icon-circle-plus-outline p-l " style="color:gray;margin-right:15px" title="添加" @click="cloumnCreate"></i>
        </div>
        <div class="list-content"  >
          <div :class="{active:item.active,'list-item':true}" v-for="item in columnlist" :key="item.id" @click="handleChoose(item)">
            <div class="list-title">{{item.name}}</div>
            <div class="lists" v-if="item.isShared==0">
              <i class="el-icon-share" title="分享" @click.stop="sharedatatwo(item)"></i>
              <i class="el-icon-edit" title="编辑" @click.stop="updatecolumndata(item)"></i>
              <i class="el-icon-delete" title="删除" @click.stop="deletecolumndata(item.id)"></i>
            </div>
              <div class="lists"  v-if="item.isShared==1">
              <span @click.stop="deletesharedata(item.navCatId)"> 取消分享</span>
            </div>
          </div>
        </div>

      </el-col>
    </el-row>
    <!--新建-->
    <el-dialog title="新增" :visible.sync="dialogVisible" width="80%" top="8vh" >
      <el-form label-width="200px">
        <el-form-item label="所属分类" style="background: #fff">

          <el-input size="small" v-model="newName" style="width:674px">报纸</el-input>
          <!--<el-select v-model="selectValue">
            <el-option v-for="item in classificationOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>-->
        </el-form-item>
      </el-form>
      <el-row style="background: #fff">
        <el-col :span="20" style="min-height:130px;left:30px" >
          <!--报纸-->
          <template v-if="activeName === 'newspaper'">
            <el-form ref="newspaper" :rules="rulesNewspaper" :model="newspaper" label-width="200px">
              <el-form-item label="纸媒名称" prop="name">
                <el-input size="small" v-model="newspaper.name"></el-input>
              </el-form-item>
              <el-form-item label="站点描述" prop="description">
                <el-input size="small" v-model="newspaper.description"></el-input>
              </el-form-item>
              <el-form-item label="绑定流程" prop="region">
                <el-select size="small" v-model="newspaper.region" placeholder="请选择绑定流程" @change="changevalue">
                  <el-option v-for="item in selectdatas" :key="item.codeValue" :value="item.codeName">{{item.codeName}}</el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
          <!--app-->
          <template v-if="activeName === 'app'" style="background: #fff">
            <el-form ref="app" :rules="rulesApp" :model="app" label-width="200px">
              <el-form-item label="系统名称" prop="name">
                <el-input size="small" v-model="app.name"></el-input>
              </el-form-item>
              <el-form-item label="站点描述" prop="description">
                <el-input size="small" v-model="app.description"></el-input>
              </el-form-item>
              <el-form-item label="主题" prop="theme">
                <el-input size="small" v-model="app.theme"></el-input>
              </el-form-item>
              <el-form-item label="系统标题" prop="title">
                <el-input size="small" v-model="app.title"></el-input>
              </el-form-item>
              <el-form-item label="绑定流程" prop="region">
                <el-select size="small" v-model="app.region" placeholder="请选择绑定流程" @change="changevalue">
                  <el-option v-for="item in selectdatas" :key="item.codeValue" :value="item.codeName">{{item.codeName}}</el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
          <!--weChat-->
          <template v-if="activeName === 'weChat'" style="background: #fff">
            <el-form ref="weChat" :rules="rulesWeChat" :model="weChat" label-width="200px">
              <el-form-item label="微信公众平台名称:" prop="nickName">
                <el-input size="small" v-model="weChat.nickName"></el-input>
                <p class="input-tips">请与微信公众平台后台设置一致</p>
              </el-form-item>
              <el-form-item label="微信公众平台接口 Token:" prop="token">
                <el-input size="small" v-model="weChat.token"></el-input>
                <p class="input-tips">请与微信公众平台后台设置一致</p>
              </el-form-item>
              <el-form-item label="微信公众平台 AppID:" prop="appId">
                <el-input size="small" v-model="weChat.appId"></el-input>
              </el-form-item>
              <el-form-item label="微信公众平台 AppSecret:" prop="secret">
                <el-input size="small" v-model="weChat.secret"></el-input>
              </el-form-item>
              <el-form-item label="上传头像: ">
                <el-upload ref="updatawc" :action="upload_img" limit="1" :on-success="handleAvatarSuccess"
                  :before-upload="beforeAvatarUpload" :before-remove="beforeRemovewc">
                  <img v-if="weChatIs" :src="upload_prefix + weChat.headImg" style="width: 80px" />
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
              </el-form-item>
              <el-form-item label="绑定流程" prop="region">
                <el-select size="small" v-model="weChat.region" placeholder="请选择绑定流程" @change="changevalue">
                  <el-option v-for="item in selectdatas" :key="item.codeValue" :value="item.codeName">{{item.codeName}}</el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
          <!--microBlog-->
          <template v-if="activeName === 'microBlog'" style="background: #fff">
            <el-form :model="microBlog" :rules="rulesMicroBlog" ref="microBlog" label-width="200px" class="demo-ruleForm"
              style="height: 350px; overflow: scroll">
              <el-form-item label="用户昵称" prop="name">
                <el-input size="small" v-model="microBlog.name"></el-input>
              </el-form-item>
              <el-form-item label="微博官网用户id">
                <el-input size="small" v-model="microBlog.openid"></el-input>
              </el-form-item>
              <el-form-item label="微博密码" prop="password">
                <el-input size="small" type="password" v-model="microBlog.password" placeholder="请输入密码"></el-input>
              </el-form-item>
              <el-form-item label="类型">
                <el-radio-group v-model="microBlog.type">
                  <el-radio :label="0">选项1</el-radio>
                  <el-radio :label="1">选项2</el-radio>
                  <el-radio :label="2">选项3</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="微博开发者工具提供secret">
                <el-input size="small" v-model="microBlog.clientSecret"></el-input>
              </el-form-item>
              <el-form-item label="微博回调地址">
                <el-input size="small" v-model="microBlog.redirectUri"></el-input>
              </el-form-item>
              <el-form-item label="clentId">
                <el-input size="small" v-model="microBlog.clentId"></el-input>
              </el-form-item>
              <el-form-item label="上传头像: ">
                <el-upload ref="updataml" class="avatar-uploader" :action="upload_img" limit="1" :on-success="microBlogSuccess"
                  :before-upload="beforeAvatarUpload" :before-remove="beforeRemoveml">
                  <img v-if="microBlogIs" :src="upload_prefix + microBlog.headpic" style="width: 80px">
                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                </el-upload>
              </el-form-item>
              <el-form-item label="绑定流程" prop="region">
                <el-select size="small" v-model="microBlog.region" placeholder="请选择绑定流程" @change="changevalue">
                  <el-option v-for="item in selectdatas" :key="item.codeValue" :value="item.codeName">{{item.codeName}}</el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
          <!--webSite-->
          <template v-if="activeName === 'website'" style="background: #fff">
            <el-form ref="webSite" :rules="rulesWebSite" :model="webSite" label-width="200px">
              <el-form-item label="站点名称" prop="name">
                <el-input size="small" v-model="webSite.name"></el-input>
              </el-form-item>
              <el-form-item label="站点描述" prop="description">
                <el-input size="small" v-model="webSite.description"></el-input>
              </el-form-item>
              <el-form-item label="站点网址" prop="url">
                <el-input size="small" v-model="webSite.url"></el-input>
              </el-form-item>
              <el-form-item label="ICP备案号" prop="icpNo">
                <el-input size="small" v-model="webSite.icpNo"></el-input>
              </el-form-item>
              <el-form-item label="绑定流程" prop="region">
                <el-select size="small" v-model="webSite.region" placeholder="请选择绑定流程" @change="changevalue">
                  <el-option v-for="item in selectdatas" :key="item.codeValue" :value="item.codeName">{{item.codeName}}</el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-form label-width="200px">
          <el-form-item label="运营机构">
            <el-col :span="20">
              <div>
                <div class="treeArea" style="padding-top: 10px;max-height: 30vh;overflow-y: auto;">

                  <el-tree ref='treeTwo' :data="treeData" :props="defaultProps" v-loading="loading" show-checkbox
                    @node-click="handleNodeClick" :expand-on-click-node='false' node-key="id" :highlight-current='true'
                    :default-expand-all='true'>
                  </el-tree>
                </div>

              </div>
            </el-col>
          </el-form-item>
        </el-form>
      </el-row>
      <span slot="footer" class="dialog-footer" >
        <el-button size="small" @click="dialogVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="saveData">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="模块新增" :visible.sync="modulesVisible" width="80%" top="8vh" >
      <el-row>
        <el-col :span="20">
          <el-form ref="modules" :rules="rulesmodules" :model="modules" label-width="200px">
            <el-form-item label="站点名称" prop="name">
              <el-input size="small" v-model="systemname"></el-input>
            </el-form-item>
            <el-form-item label="模块名称" prop="name">
              <el-input size="small" v-model="modules.name"></el-input>
            </el-form-item>
            <el-form-item v-if="activeName === 'newspaper'" label="出版日期" prop="publicationDate">
              <el-date-picker
                v-model="modules.publicationDate"
                size="small"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="导航序号" prop="orders">
              <el-input size="small" v-model="modules.orders" controls-position="left" type="number"></el-input>
            </el-form-item>
            <el-form-item label="导航编码" prop="code">
              <el-input size="small" v-model="modules.code" controls-position="left" type="number"></el-input>
            </el-form-item>
            <el-form-item label="是否上线" prop="status">
              <el-switch v-model="modules.status" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="上传图片" prop="updataImgurl">
                <el-upload
                  class="upload-demo"
                  :action="upload_img1"
                  :on-success="uploadSuccess"
                  :file-list="fileList"
                  list-type="picture"
                  ref="updata" limit="1"
                  :before-remove="beforeRemove"
                  :on-remove="handleRemove">
                  <el-button size="small" type="primary">点击上传</el-button>
                </el-upload>
            </el-form-item>
            <el-form-item label="运营机构" prop="name">
              <el-row :gutter="23">
                <el-col :span="20">
                  <div>
                    <div class="treeArea" style="padding-top: 10px;max-height: 25vh;overflow-y: auto;">
                      <el-tree ref='treeTwocopy' :data="treeData" :props="defaultProps" v-loading="loading" show-checkbox
                        @node-click="handleNodeClick" :expand-on-click-node='false' node-key="id" :highlight-current='true'
                        :default-expand-all='true'>
                      </el-tree>
                    </div>
                  </div>
                </el-col>
              </el-row>

            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="modulesVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="savemodulesdata">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="模块编辑" :visible.sync="editmodulesVisible" width="80%" top="8vh">
      <el-row>
        <el-col :span="20">
          <el-form ref="editmodules" :rules="rulesmodules" :model="editmodules" label-width="200px">
            <el-form-item label="模块名称" prop="name">
              <el-input size="small" v-model="editmodules.name"></el-input>
            </el-form-item>
            <el-form-item v-if="activeName === 'newspaper'" label="出版日期" prop="publicationDate">
              <el-date-picker
                v-model="editmodules.publicationDate"
                size="small"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="导航序号" prop="orders">
              <el-input size="small" v-model="editmodules.orders" type="number"></el-input>
            </el-form-item>
            <el-form-item label="导航编码" prop="code">
              <el-input size="small" v-model="editmodules.code" type="number"></el-input>
            </el-form-item>
            <el-form-item label="是否上线" prop="status">
              <el-switch v-model="editmodules.status" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="上传图片" prop="updataImgurl">
              <div v-if="!ImgUrlUploaded">
              <el-upload
                class="upload-demo"
                :action="upload_img1"
                :on-success="edituploadSuccess"
                :file-list="fileList2"
                list-type="picture"
                limit="1"
              >
                <el-button size="small" type="primary">点击上传</el-button>
              </el-upload>
              </div>
              <div v-if="ImgUrlUploaded">
                <el-button size="small" @click="ImgUrlUploaded=false" style="margin-bottom:10px;">重新上传</el-button>
                <img :src="editmodules.image" style="width:100%;">
              </div>
            </el-form-item>
             <el-form-item label="运营机构">
              <el-col :span="20">
                <div>
                  <div class="treeArea" style="padding-top: 10px;max-height: 30vh;overflow-y: auto;">

                    <el-tree ref='updateTreeTwo' :data="treeData" :props="defaultProps" v-loading="loading" show-checkbox
                      @node-click="handleNodeClick" :expand-on-click-node='false' node-key="id" :highlight-current='true'
                      :default-expand-all='true'>
                    </el-tree>
                  </div>

                </div>
              </el-col>
            </el-form-item>
          </el-form>
        </el-col>

      </el-row>

      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="editmodulesVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="saveeditmodulesdata(editmodules.id)">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="栏目新增" :visible.sync="columnVisible" width="80%" top="8vh">
      <el-row>
        <el-col :span="20">
          <el-form ref="column" :rules="rulescolumn" :model="column" label-width="200px">
            <el-form-item label="模块名称" prop="moudlename">

              <el-input size="small" v-model="modulename"></el-input>
            </el-form-item>
            <el-form-item label="栏目名称" prop="name">
              <el-input size="small" v-model="column.name"></el-input>
            </el-form-item>
            <el-form-item label="别名" prop="alias">
              <el-input size="small" v-model="column.alias"></el-input>
            </el-form-item>
            <el-form-item label="描述" prop="description">
              <el-input size="small" type="textarea" :rows="3" placeholder="请输入内容" v-model="column.description"></el-input>
            </el-form-item>
            <el-form-item label="导航序号" prop="orders">
              <el-input size="small" v-model="column.orders" type="number"></el-input>
            </el-form-item>
            <el-form-item label="类型" prop="type">
              <el-select size="small" v-model="column.type" placeholder="请选择">
                <el-option label="普通栏目" value="1"></el-option>
                <el-option label="专题栏目" value="2"></el-option>
                <el-option label="推荐栏目" value="3"></el-option>
                <el-option label="外链" value="4"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="栏目编码" prop="code">
              <el-select size="small" v-model="column.code" placeholder="请选择">
                <el-option label="推荐" value="first"></el-option>
                <el-option label="新时代" value="learn"></el-option>
                <el-option label="视频" value="video"></el-option>
                <el-option label="直播" value="live"></el-option>
                <el-option label="部长" value="head"></el-option>
                <el-option label="专题" value="special"></el-option>
                <el-option label="场馆" value="cg"></el-option>
                <el-option label="活动" value="hd"></el-option>
                <el-option label="艺术家" value="ysj"></el-option>
                <el-option label="其它" value="info"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="是否上线" prop="status">
              <el-switch v-model="column.status" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="上传图片" prop="updataImgurl">
                <el-upload
                  class="upload-demo"
                  :action="upload_img2"
                  :on-success="uploadSuccess1"
                  :file-list="fileList2"
                  list-type="picture"
                  ref="updata1" limit="1"
                  :before-remove="beforeRemove1">
                  <el-button size="small" type="primary">点击上传</el-button>
                </el-upload>
            </el-form-item>
            <el-form-item label="是否可定制" prop="customizable">
              <el-switch v-model="column.customizable" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="是否默认显示" prop="defaultDisp">
              <el-switch v-model="column.defaultDisp" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="外链URL" prop="url">
              <div>
                <el-input size="small" placeholder="请输入内容" v-model="column.url">
                  <template slot="prepend">Http://</template>
                </el-input>
              </div>
            </el-form-item>
            <el-form-item label="运营人员" prop="defaultDisp">
              <el-row :gutter="20">

                <el-col :span="20">
                  <div>
                    <div class="treeArea" style="padding-top: 10px;max-height: 30vh;overflow-y: auto;">

                      <el-tree ref='treeOne' :data="list" :props="defaultProps" v-loading="loading" show-checkbox
                        @node-click="handleNodeClick" :expand-on-click-node='false' node-key="id" :highlight-current='true'
                        :default-expand-all='true'>
                      </el-tree>
                    </div>

                  </div>
                </el-col>

              </el-row>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="columnVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="savecolumndata">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="栏目编辑" :visible.sync="editcolumnVisible" width="80%" top="8vh">
      <el-row>
        <el-col :span="20">
          <el-form ref="editcolumn" :rules="rulescolumn" :model="editcolumn" label-width="200px">
            <el-form-item label="栏目名称" prop="name">
              <el-input v-model="editcolumn.name"></el-input>
            </el-form-item>
            <el-form-item label="别名" prop="alias">
              <el-input v-model="editcolumn.alias"></el-input>
            </el-form-item>
            <el-form-item label="描述" prop="description">
              <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="editcolumn.description"></el-input>
            </el-form-item>
            <el-form-item label="导航序号" prop="orders">
              <el-input v-model="editcolumn.orders" type="number"></el-input>
            </el-form-item>
            <el-form-item label="类型" prop="type">
              <el-select v-model="editcolumn.type" placeholder="请选择">
                <el-option label="普通栏目" value="1"></el-option>
                <el-option label="专题栏目" value="2"></el-option>
                <el-option label="推荐栏目" value="3"></el-option>
                <el-option label="外链" value="4"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="栏目编码" prop="code">
              <el-select v-model="editcolumn.code" placeholder="请选择">
                <el-option label="推荐" value="first"></el-option>
                <el-option label="新时代" value="learn"></el-option>
                <el-option label="视频" value="video"></el-option>
                <el-option label="直播" value="live"></el-option>
                <el-option label="部长" value="head"></el-option>
                <el-option label="专题" value="special"></el-option>
                <el-option label="场馆" value="cg"></el-option>
                <el-option label="活动" value="hd"></el-option>
                <el-option label="艺术家" value="ysj"></el-option>
                <el-option label="其它" value="info"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="是否上线" prop="status">
              <el-switch v-model="editcolumn.status" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="上传图片" prop="updataImgurl">
              <div v-if="!ImgUrlUploaded1">
              <el-upload
                class="upload-demo"
                :action="upload_img2"
                :on-success="edituploadSuccess1"
                :file-list="fileList2"
                list-type="picture"
                limit="1"
               >
                <el-button size="small" type="primary">点击上传</el-button>
              </el-upload>
              </div>
              <div v-if="ImgUrlUploaded1">
                <el-button size="small" @click="ImgUrlUploaded1=false" style="margin-bottom:10px;">重新上传</el-button>  
                <img :src="editcolumn.image" style="width:100%;">
              </div>
            </el-form-item>
            <el-form-item label="是否可定制" prop="customizable">
              <el-switch v-model="editcolumn.customizable" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="是否默认显示" prop="defaultDisp">
              <el-switch v-model="editcolumn.defaultDisp" active-color="#13ce66" inactive-color="#ddd" active-value="1"
                inactive-value="0"></el-switch>
            </el-form-item>
            <el-form-item label="外链URL" prop="url">
              <div>
                <el-input placeholder="请输入内容" v-model="editcolumn.url">
                  <template slot="prepend">Http://</template>
                </el-input>
              </div>
            </el-form-item>
            <el-form-item label="运营人员" prop="defaultDisp">
              <el-row :gutter="20">
                 <el-col :span="20">
                  <div>
                    <div class="treeArea" style="padding-top: 10px;max-height: 30vh;overflow-y: auto;">
                      <el-tree ref='treeOnecopy' :data="list" :props="defaultProps" v-loading="loading" show-checkbox
                        :expand-on-click-node='false' node-key="id" :highlight-current='true'
                        :default-expand-all='true'>
                      </el-tree>
                    </div>
                  </div>
                </el-col>
               </el-row>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="editcolumnVisible = false">取 消</el-button>
        <el-button size="small" type="primary" @click="saveeditcolumndata(editcolumn.id)">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="共享到栏目" :visible.sync="modulesShare" width="25%" top="22vh" left="8vh">
      <el-row>
        <el-col :span="20">
          <el-form ref="saveeditshare"
            :rules="rulesmodulesshare"
            :model="editmodules" label-width="60px"
            style="max-height:330px;overflow-x:hidden">

            <el-form-item label="" prop="name" >
              <el-checkbox-group v-model="checkedCitiesone" @change="handleCheckedCitiesChange" style="margin-left:-70px">
                <el-checkbox name="item.id" style="width:110px" v-for="item in saveeditshare" :label="item.id" :key="item.id">{{item.name}}</el-checkbox>
              </el-checkbox-group>
            </el-form-item>

          </el-form>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="modulesShare = false">取 消</el-button>
        <el-button size="small" type="primary" @click="saveeditshareone()">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="共享到站点" :visible.sync="modulesSharetwo" width="25%" top="22vh" left="8vh">
      <el-row >
        

        <el-col :span="20">
          <el-form ref="cityneme"
            :rules="rulesmodulessharetwo"
            :model="editmodules" label-width="60px"
            style="max-height:330px;overflow-x:hidden">
            <el-form-item label="" prop="name" >
              <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChangetwo" style="margin-left:-70px">
                <el-checkbox name="item.id" style="width:110px" v-for="item in cityneme" :label="item.id" :key="item.id">{{item.name}}</el-checkbox>
              </el-checkbox-group>
            </el-form-item>

          </el-form>
        </el-col>
        <el-col :span="3" style="display:none" ref="categoryid">
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="modulesSharetwo = false">取 消</el-button>
        <el-button size="small" type="primary" @click="saveeditsharetwo()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import MultistationAppList from "@/components/MultistationAppList";
import MultistationMicroBlogList from "@/components/MultistationMicroBlogList";
import MultistationNewspaperList from "@/components/MultistationNewspaperList";
import MultistationWebsiteList from "@/components/MultistationWebsiteList";
import MultistationWeChatList from "@/components/MultistationWeChatList";
import MultistationChooseColumn from "@/components/MultistationChooseColumn";
import { getOrgTree } from "@/api/systemManage/partJobManagement";

import { compositeSelect } from "@/api/systemManage/userManagement";
import {
  newspaperNew,
  webSiteNew,
  weChatNew,
  appNew,
  microBlogNew,
  copyModuleRequest,
  getModulesBySite,
  addModulesBySite,
  updateModulesBySite,
  deleteModulesBySite,
  getColumnByModules,
  addColumnByModules,
  updateColumnByModules,
  deleteColumnByModules,
  detailColumnByModules,
  organization,
  findShareCategory, //模块列表分享
  updateShareCategory, //确定模块列表分享
  selectTerminalTag, //共享到站点
  insertTerminalCategory, //共享到站点
  cancelShareCategory //取消分享
} from "@/api/systemManage/multistationManagement";
import Bus from "@/utils/eventTransfer.js";
import { compositeScach } from "@/api/systemManage/roleManagement";
const listOrg = [];

export default {
  data() {
    return {
      // 图片
      // fileList:[],
      microBlogIs: false,
      weChatIs: false,
      ImgUrlUploaded: false,
      ImgUrlUploaded1: false,
      // 绑定流程 开始
      selectdatas: [],
      listItems: {
        rowBounds: {
          // offset: 1,
          offset: 0,
          limit: 100
        },
        condition: [
          {
            property: "codeType",
            value: "WORK_FLOW",
            type: "EQ"
          },
          {
            property: "status",
            value: "0",
            type: "EQ"
          }
        ],
        sort: [
          {
            direction: "ASC",
            property: "orderNo"
          }
        ],
        fields: []
      },
      auditType: "",
      // 绑定流程 结束
      //人员机构树
      newspaper: {},
      itemCategoryid: "",
      cityneme: [],
      saveeditshare: [],
      treeDataone: [],
      alltags: "",
      alltagsone: "",
      treeDatatwo: [],
      arrvalueone: [],
      arrvaluetwo: [],
      treeDatathree: [],
      systemOrgids: [],
      operatingAgencyname: "",
      //共享站点
      checkedCities: [],
      checkedCitiesone: [],
      listQuery: {
        rowBounds: {
          offset: 1,
          limit: 1000000
        },
        condition: {
          loginName: {
            property: "loginName",
            value: "",
            type: "LIKE"
          },
          name: {
            property: "name",
            value: "",
            type: "LIKE"
          },
          status: {
            property: "status",
            value: "",
            type: "ENUM"
          }
        },
        sort: [
          {
            direction: "DESC",
            property: "fcTime"
          }
        ]
      },
      cities: [],
      loading: false,
      app: {},
      weChat: {
        headImg: ""
      },
      microBlog: {
        headpic: ""
      },
      rulesWebSite: {
        name: [
          {
            required: true,
            message: "请输入站点名称",
            trigger: "blur"
          }
        ],
        description: [
          {
            required: true,
            message: "请输入站点描述",
            trigger: "blur"
          }
        ],
        url: [
          {
            required: true,
            message: "请输入站点网址",
            trigger: "blur"
          }
        ],
        region: [
          {
            required: true,
            message: "请选择绑定流程",
            trigger: "blur"
          }
        ]
      },
      rulesWeChat: {
        nickName: [
          {
            required: true,
            message: "请输入微信公众平台名称",
            trigger: "blur"
          }
        ],
        token: [
          {
            required: true,
            message: "请输入微信公众平台接口 Token",
            trigger: "blur"
          }
        ],
        appId: [
          {
            required: true,
            message: "请输入微信公众平台 AppID",
            trigger: "blur"
          }
        ],
        region: [
          {
            required: true,
            message: "请选择绑定流程",
            trigger: "blur"
          }
        ]
      },
      rulesApp: {
        name: [
          {
            required: true,
            message: "请输入系统名称",
            trigger: "blur"
          }
        ],
        theme: [
          {
            required: true,
            message: "请输入主题",
            trigger: "blur"
          }
        ],
        title: [
          {
            required: true,
            message: "请输入系统标题",
            trigger: "blur"
          }
        ],
        region: [
          {
            required: true,
            message: "请选择绑定流程",
            trigger: "blur"
          }
        ]
      },
      rulesNewspaper: {
        name: [
          {
            required: true,
            message: "请输入纸媒名称",
            trigger: "blur"
          }
        ],
        description: [
          {
            required: true,
            message: "请输入站点描述",
            trigger: "blur"
          }
        ],
        region: [
          {
            required: true,
            message: "请选择绑定流程",
            trigger: "blur"
          }
        ]
      },
      rulesMicroBlog: {
        name: [
          {
            required: true,
            message: "请输入用户昵称",
            trigger: "blur"
          },
          {
            min: 3,
            max: 10,
            message: "长度在 3 到 10 个字符",
            trigger: "blur"
          }
        ],
        password: [
          {
            required: true,
            message: "请输入微博密码",
            trigger: "blur"
          },
          {
            min: 3,
            max: 20,
            message: "长度在 3 到 20 个字符",
            trigger: "blur"
          }
        ],
        region: [
          {
            required: true,
            message: "请选择绑定流程",
            trigger: "blur"
          }
        ]
      },
      webSite: {},
      upload_img: process.env.BASE_API + "/zcmtask" + "/zcm/upload/pic",
      // upload_prefix: process.env.BASE_API + "/zcmtask",
      upload_prefix: process.env.BASE_API + "/videaapi",
      // 上传图片
      upload_img1:
        process.env.BASE_API + "/videaapi/zcm/upload/pic?type=navigation", //模块的
      upload_img2:
        process.env.BASE_API + "/videaapi/zcm/upload/pic?type=category", //栏目的
      classificationOptions: [
        {
          value: "newspaper",
          label: "报纸"
        },
        {
          value: "app",
          label: "APP"
        },
        {
          value: "weChat",
          label: "微信"
        },
        {
          value: "microBlog",
          label: "微博"
        },
        {
          value: "webSite",
          label: "网站"
        }
      ],
      selectValue: "newspaper",
      dialogVisible: false,
      treeData: [],
      defaultProps: {
        children: "children",
        label: "name"
      },
      activeName: "",
      loading: false,
      list: [],
      tableKey: 0,
      total: null,
      selectItem: {
        selectId: "",
        selectOuinfoId: "",
        selectOuinfoName: "",
        selectItems: [],
        orgName: ""
      },
      modulesVisible: false,
      arrvalue: "",
      editmodulesVisible: false,
      columnVisible: false,
      editcolumnVisible: false,
      //模块分享
      modulesShare: false,
      modulesSharetwo: false,
      systemid: "", //站点id
      moduleslist: [],
      modules: {},
      editmodules: {},
      rulesmodules: {
        name: [
          {
            required: true,
            message: "请输入模块名称",
            trigger: "blur"
          }
        ],
        orders: [
          {
            required: true,
            message: "请输入序号",
            trigger: "blur"
          }
        ],
        publicationDate: [
          {
            required: true,
            message: "请输入出版日期",
            trigger: "blur"
          }
        ]
      },
      modulesid: "", //导航id 模块id
      columnlist: [],
      modules: {},
      column: {},
      editcolumn: {},
      rulescolumn: {
        orders: [
          {
            required: true,
            message: "请输入序号",
            trigger: "blur"
          }
        ],
        name: [
          {
            required: true,
            message: "请输入栏目名",
            trigger: "blur"
          }
        ],
        code: [
          {
            required: true,
            message: "请输入栏目编码",
            trigger: "blur"
          }
        ],
        type: [
          {
            required: true,
            message: "请选择类型",
            trigger: "blur"
          }
        ]
      }
    };
  },
  components: {
    MultistationAppList,
    MultistationMicroBlogList,
    MultistationNewspaperList,
    MultistationWebsiteList,
    MultistationWeChatList,
    MultistationChooseColumn
  },
  watch: {
    selectValue: {
      handler: function(val, oldVal) {
        if (oldVal) this.$refs[oldVal].resetFields();
      },
      immediate: true
    },
    systemid: function(val, oldval) {
      this.getmoduleslist();
    },
    modulesid: function(val, oldval) {
      this.getcolumnlist();
    }
    // ite: function(val) {
    //   this.weekse = val;
    //   console.log(this.weekse);
    //   this.getL();
    // }
  },
  mounted() {
    this.loading = true;
    const id = {
      id: this.$store.getters.orgId
    };
    getOrgTree(id).then(response => {
      this.treeData = response.data.data;
      // 默认给个组织机构ID
      this.selectItem.selectOuinfoId = this.treeData[0].id;
      this.loading = false;
      this.activeName = "newspaper";
    });
    this.newName = "报纸";
  },
  beforeMount() {
    this.selectdata();
  },
  methods: {
    beforeRemoveml(file, fileList) {
      if (file && file.status === "success") {
        this.$confirm("确认删除该记录？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.microBlog.headpic = false;
            this.microBlogIs = false;
          })
          .catch(error => {
            console.error(error);
          });
      }
    },
    beforeRemovewc(file, fileList) {
      if (file && file.status === "success") {
        this.$confirm("确认删除该记录？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.weChat.headImg = false;
            this.weChatIs = false;
          })
          .catch(error => {
            console.error(error);
          });
      }
    },
    // 模块删除图片
    beforeRemove(file, fileList) {
      return this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$message({
            type: "success",
            message: "删除成功!"
          });
          this.modules.image = "";
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 栏目删除图片
    beforeRemove1(file, fileList) {
      return this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.$message({
            type: "success",
            message: "删除成功!"
          });
          this.column.image = "";
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 模块上传图片
    uploadSuccess(file) {
      if (file.statusCode == "200") {
        this.modules.image = file.data.imager_url;
      } else {
        this.$message({ type: "error", message: "上传图片失败！" });
      }
    },
    edituploadSuccess(file) {
      if (file.statusCode == "200") {
        this.editmodules.image = file.data.imager_url;
      } else {
        this.$message({ type: "error", message: "上传图片失败！" });
      }
    },
    // 栏目上传图片
    uploadSuccess1(file) {
      if (file.statusCode == "200") {
        this.column.image = file.data.imager_url;
      } else {
        this.$message({ type: "error", message: "上传图片失败！" });
      }
    },
    edituploadSuccess1(file) {
      if (file.statusCode == "200") {
        this.editcolumn.image = file.data.imager_url;
      } else {
        this.$message({ type: "error", message: "上传图片失败！" });
      }
    },
    changevalue(val) {
      let obj = {};
      obj = this.selectdatas.find(item => {
        return item.codeName === val;
      });
      this.auditType = obj.codeValue;
    },
    // 加载下拉数据 绑定流程
    selectdata() {
      compositeScach(this.listItems).then(response => {
        this.selectdatas = response.data.data.records;
      });
    },
    // 模块复制按钮
    copyModule(item) {
      let search = {
        copiedId: item.id,
        crtUser: this.$store.getters.userid,
        name: item.name
      };
      copyModuleRequest(search).then(response => {
        if (response.data.statusCode === 200) {
          this.getmoduleslist();
        } else {
          this.$message.error("查询失败");
        }
      });
    },
    //共享到站点
    handleCheckedCitiesChangetwo(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.cityneme.length;
      this.isIndeterminate =
        checkedCount > 0 && checkedCount < this.cityneme.length;
    },
    //共享到栏目
    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.saveeditshare.length;
      this.isIndeterminate =
        checkedCount > 0 && checkedCount < this.saveeditshare.length;
    },
    //栏目模块(共享到站点)
    sharedatatwo(row) {
      var alltags = "";
      this.modulesSharetwo = true;
      this.checkedCities = [];
      //调接参数
      let searchstr = {
        id: row.id
      };
      //数据接口
      selectTerminalTag(searchstr).then(response => {
        if (response.data.statusCode === 200) {
          this.cityneme = response.data.data; //复选框赋值
          this.checkedCities = [];
          //复选框回显
          for (let i = 0; i < this.cityneme.length; i++) {
            this.alltags = this.cityneme[i].tag;
            if (this.alltags == 1) {
              this.checkedCities.push(this.cityneme[i].id);
            }
          }
          this.categoryid = searchstr.id; //保存id
        } else {
          this.$message.error("查询失败");
        }
      });
    },
    //共享到站点确定
    saveeditsharetwo() {
      //保存编辑模块数据
      var form = "cityneme";
      this.$refs[form].validate(valid => {
        if (valid) {
          //传参
          let searchstr = {
            siteidTarget: this.checkedCities.toString(),
            categoryid: this.itemCategoryid,
            crtUser: this.$store.getters.userid
          };
          //确认接口
          insertTerminalCategory(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "分享成功",
                type: "success"
              });
              this.modulesSharetwo = false;
            } else {
              this.$message.error("分享失败");
            }
          });
        }
      });
    },
    //分享模块（共享到栏目）
    sharedataone(row) {
      this.modulesShare = true;
      if (this.systemid == "") {
        return;
      }
      this.checkedCitiesone = [];
      //传参
      let searchstr = "?navId=" + this.modulesid + "&siteId=" + this.systemid;

      //数据接口
      findShareCategory(searchstr).then(response => {
        if (response.data.statusCode === 200) {
          //复选框赋值
          this.saveeditshare = response.data.data;
          this.checkedCitiesone = [];
          //复选框回显
          for (let i = 0; i < this.saveeditshare.length; i++) {
            this.alltagsone = this.saveeditshare[i].isChecked;
            if (this.alltagsone == 1) {
              this.checkedCitiesone.push(this.saveeditshare[i].id);
            }
          }
        } else {
          this.$message.error("查询失败");
        }
      });
    },
    //共享到栏目确定
    saveeditshareone(id) {
      //保存编辑模块数据
      var form = "saveeditshare";
      this.$refs[form].validate(valid => {
        if (valid) {
          // 初始化变量，拼接传参
          let search = "";
          this.checkedCitiesone.forEach(item => {
            this.saveeditshare.forEach(i => {
              if (item === i.id) {
                search += i.id + "::" + i.name + ",";
              }
            });
          });
          search = search.substring(0, search.length - 1);
          //传参
          let searchstr =
            "?idAndNames=" +
            search +
            "&categoryid=" +
            this.categoryid +
            "&userId=" +
            this.$store.getters.userid +
            "&siteId=" +
            this.systemid +
            "&navId=" +
            this.modulesid; //模块id

          //确认接口
          updateShareCategory(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "分享成功",
                type: "success"
              });
              this.modulesShare = false;
              this.getcolumnlist(); //调接口刷新数据
              search = "";
              this.saveeditshare = [];
            } else {
              this.$message.error("分享失败");
            }
          });
        }
      });
    },
    //取消分享
    deletesharedata(id) {
      cancelShareCategory(id).then(response => {
        if (response.data.statusCode === 200) {
          this.$message({
            message: "取消成功",
            type: "success"
          });
          this.getcolumnlist(); //刷新列表
        } else {
          this.$message.error("取消失败");
        }
      });
    },
    handlemodulesclick(ids) {
      //点击站点
      console.log("999999999", ids);
      this.systemid = ids.id;
      if (ids.name) {
        this.systemname = ids.name;
      } else {
        this.systemname = ids.nickName;
      }

      this.systemOrgids = ids.orgIds;

      this.columnlist = [];
      this.modulesid = "";
    },
    handleColumnClick(ids) {
      //点击模块
      this.modulesid = ids.id;
      this.listOrg = ids.orgIds;
      this.modulename = ids.name;
      for (let i = 0; i < this.moduleslist.length; i++) {
        if (this.moduleslist[i].id == ids.id) {
          this.moduleslist[i].active = true;
        } else {
          this.moduleslist[i].active = false;
        }
      }
    },
    handleChoose(ids) {
      //点击 栏目
      this.itemCategoryid = ids.id;
      this.navCatId = ids.navCatId;
      for (let i = 0; i < this.columnlist.length; i++) {
        if (this.columnlist[i].id == ids.id) {
          this.columnlist[i].active = true;
        } else {
          this.columnlist[i].active = false;
        }
      }
    },
    modulesCreate() {
      //显示模块新增模态框
      if (this.systemid == "") {
        this.$message({
          message: "请选择站点",
          type: "success"
        });
        return;
      }
      this.modulesVisible = true;
      this.modules = {};
      // 模块清空图片
      if (this.$refs.updata) {
        this.$refs.updata.clearFiles();
      }
      // this.getTree();
    },
    cloumnCreate() {
      //显示栏目新增模态框
      if (this.modulesid == "") {
        this.$message({
          message: "请选择模块",
          type: "success"
        });
        return;
      }
      // 栏目清空图片
      if (this.$refs.updata1) {
        this.$refs.updata1.clearFiles();
      }
      this.listQuery.orgId = this.$store.getters.orgId;
      this.listQuery.rowBounds.limit = 100000;
      this.list = [];
      if (this.listOrg.length > 0) {
        this.listOrg.forEach(val => {
          this.listQuery.orgId = val;
          compositeSelect(this.listQuery).then(response => {
            this.list = this.list.concat(response.data.data.records);
            this.total = response.data.data.count;
            this.listLoading = false;

            // this.listQuery.condition.status.type = 'EQ'
          });
        });
      }
      this.columnVisible = true;
      this.column = {};
      // this.getTree();
    },
    getmoduleslist() {
      if (this.systemid == "") {
        return;
      }
      let searchstr = {
        condition: [
          {
            property: "systemId",
            value: this.systemid,
            type: "EQ"
          }
        ],
        sort: [],
        fields: [],
        rowBounds: {
          offset: 0,
          limit: 1000000000
        }
      };
      getModulesBySite(searchstr).then(response => {
        let _data = response.data.data.records;
        for (let i = 0; i < _data.length; i++) {
          _data[i].active = false;
        }
        this.moduleslist = _data;
        // 点击模块
        if (this.moduleslist != "" && this.moduleslist[0] != "") {
          this.handleColumnClick(this.moduleslist[0]);
        }
      });
    },
    getcolumnlist() {
      if (this.modulesid == "") {
        return;
      }
      let searchstr = {
        condition: [
          {
            property: "navId",
            value: this.modulesid,
            type: "EQ"
          }
        ],
        sort: [],
        fields: [],
        rowBounds: {
          offset: 0,
          limit: 1000000000
        }
      };
      getColumnByModules(searchstr).then(response => {
        let _data = response.data.data.records;

        for (let i = 0; i < _data.length; i++) {
          _data[i].active = false;
        }
        this.columnlist = _data;
      });
    },
    savemodulesdata() {
      //添加模块数据
      var form = "modules";
      this.$refs[form].validate(valid => {
        if (valid) {
          // this.listQuery.orgId = this.$store.getters.orgId
          this.modules.systemId = this.systemid;
          this.modules.orgIds = this.$refs.treeTwocopy.getCheckedKeys();
          this.arrvalueone = this.modules.orgIds;
          if (this.modules.status == ("" || undefined)) {
            this.modules.status = "0";
          }
          this.modules.customizable = false;
          this.modules.crtUser = "";
          if (this.activeName === "newspaper") {
            this.modules.modelId = 5;
          }
          if (this.activeName === "app") {
            this.modules.modelId = 1;
          }
          if (this.activeName === "weChat") {
            this.modules.modelId = 2;
          }
          if (this.activeName === "microBlog") {
            this.modules.modelId = 4;
          }
          if (this.activeName === "website") {
            this.modules.modelId = 3;
          }

          addModulesBySite(this.modules).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "新增成功",
                type: "success"
              });
              this.modulesVisible = false;
              this.getmoduleslist();
              this.modules.name = "";
              this.modules.orders = "";
              this.modules.status = "0";
              //清空运营人员
              this.$refs.treeTwocopy.setCheckedNodes([]);
              // 模块清空图片
              if (this.$refs.updata) {
                this.$refs.updata.clearFiles();
              }
              // 栏目清空图片
              if (this.$refs.updata1) {
                this.$refs.updata1.clearFiles();
              }
            } else {
              this.$message.error("新增失败");
            }
          });
        }
      });
    },
    saveeditmodulesdata(id) {
      //保存编辑模块数据
      var form = "editmodules";
      this.$refs[form].validate(valid => {
        if (valid) {
          let searchstr = {
            id: this.editmodules.id,
            name: this.editmodules.name,
            status: this.editmodules.status,
            systemId: this.editmodules.systemId,
            modelId: this.editmodules.modelId,
            customizable: this.editmodules.customizable,
            publicationDate: this.editmodules.publicationDate,
            orders: this.editmodules.orders,
            updUser: "",
            orgIds: this.$refs.updateTreeTwo.getCheckedKeys(),
            // 图片
            image:
              this.editmodules.image.indexOf(process.env.BASE_API) >= 0
                ? this.editmodules.image.split("videaapi")[1]
                : this.editmodules.image,
            // 导航编码
            code: this.editmodules.code
          };

          searchstr.orgIds = this.$refs.updateTreeTwo.getCheckedKeys();

          updateModulesBySite(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "更新成功",
                type: "success"
              });
              this.editmodulesVisible = false;
              this.getmoduleslist();
              this.editmodules = {};
            } else {
              this.$message.error("更新失败");
            }
          });
        }
      });
    },

    updatemodulesdata(row) {
      console.log("返回", row);

      //显示模块编辑框并赋值
      this.editmodulesVisible = true;
      row.status = "" + row.status + "";
      this.editmodules = row;

      const id = {
        id: this.$store.getters.orgId
      };
      // 图片
      if (this.editmodules.image) {
        this.ImgUrlUploaded = true;
      } else {
        this.ImgUrlUploaded = false;
      }

      getOrgTree(id).then(response => {
        this.treeData = response.data.data;
        this.$refs.updateTreeTwo.setCheckedKeys(row.orgIds);
        // 默认给个组织机构ID
        // let self = this;
        // this.selectItem.selectOuinfoId = this.treeData[0].id

        // this.loading = false
      });
    },
    deletemodulesdata(id) {
      //删除模块
      let searchstr = {
        id: id
      };
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          deleteModulesBySite(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "删除成功",
                type: "success"
              });
              this.getmoduleslist();
            } else {
              this.$message.error("删除失败");
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    updatecolumndata(row) {
      console.log("栏目编辑", row);
      //显示栏目编辑框并赋值
      this.editcolumnVisible = true;
      this.navCatId = row.navCatId;
      let searchstr = {
        condition: [
          {
            property: "id",
            value: row.id,
            type: "EQ"
          }
        ],
        sort: [],
        fields: [],
        rowBounds: {
          offset: 0,
          limit: 1000000
        },
        navCatId: row.navCatId
      };
      // 图片
      if (this.editcolumn.image) {
        this.ImgUrlUploaded1 = true;
      } else {
        this.ImgUrlUploaded1 = false;
      }
      // this.getTree();

      detailColumnByModules(searchstr).then(response => {
        if (response.data.statusCode === 200) {
          //遍历人员

          this.list = [];
          if (this.listOrg.length > 0) {
            this.listOrg.forEach(val => {
              this.listQuery.orgId = val;
              console.log("人员", val);

              compositeSelect(this.listQuery).then(response => {
                this.list = this.list.concat(response.data.data.records);
                console.log("人员111", this.list);
                this.total = response.data.data.count;
                this.listLoading = false;
                // this.listQuery.condition.status.type = 'EQ'
              });
            });
          }
          //运营人员
          if (response.data.data.orgIds) {
            this.$refs.treeOnecopy.setCheckedKeys(response.data.data.orgIds);
          }

          let _data = response.data.data;
          // console.log(_data)
          _data.status = "" + _data.status + "";
          if (!_data.customizable) {
            _data.customizable = 0;
          }
          if (!_data.defaultDisp) {
            _data.defaultDisp = 0;
          }
          _data.customizable = "" + _data.customizable + "";
          _data.defaultDisp = "" + _data.defaultDisp + "";
          this.editcolumn = _data;
          if (this.editcolumn.image) {
            this.editcolumn.image =
              process.env.BASE_API + "/videaapi" + this.editcolumn.image;
          }
        } else {
          this.$message.error("删除失败");
        }
      });
    },
    saveeditcolumndata() {
      //保存栏目编辑数据
      var form = "editcolumn";
      this.$refs[form].validate(valid => {
        if (valid) {
          let searchstr = {
            // 新加参数 开始
            appNormalCategoryInsertInputBean: {
              alias: this.editcolumn.alias,
              code: this.editcolumn.code, //推荐 栏目编码
              description: this.editcolumn.description,
              level: 1,
              icon: "",
              name: this.editcolumn.name,
              orders: this.editcolumn.orders,
              ////运营人员
              orgIds: this.$refs.treeOnecopy.getCheckedKeys(),
              pid: 0,
              status: this.editcolumn.status,
              systemId: this.systemid, //站点id
              type: this.editcolumn.type,
              systemType: this.editcolumn.systemType, //站点类型

              url: this.editcolumn.url, //外链id
              updUser: this.$store.getters.userid, //修改人id1
              updTime: this.editcolumn.updTime, //修改时间

              id: this.editcolumn.id, //栏目id2
              // 图片
              image:
                this.editcolumn.image.indexOf(process.env.BASE_API) >= 0
                  ? this.editcolumn.image.split("videaapi")[1]
                  : this.editcolumn.image
            },

            defaultDisp: this.editcolumn.defaultDisp,
            customizable: this.editcolumn.customizable,

            refId: this.editcolumn.id, //栏目id1
            updUser: this.$store.getters.userid, //修改人id2
            url: this.editcolumn.url, //栏目路径

            id: this.navCatId, //导航栏目id 返回的
            status: 1,
            type: 1,

            orders: this.editcolumn.orders,
            navId: this.modulesid, //导航id就是模块id
            name: this.editcolumn.name,
            ////运营人员
            orgIds: this.$refs.treeOnecopy.getCheckedKeys()

            // 新加参数 结束
          };
          if (this.activeName === "newspaper") {
            this.editcolumn.systemType = 5;
          }
          if (this.activeName === "app") {
            this.editcolumn.systemType = 1;
          }
          if (this.activeName === "weChat") {
            this.editcolumn.systemType = 2;
          }
          if (this.activeName === "microBlog") {
            this.editcolumn.systemType = 4;
          }
          if (this.activeName === "website") {
            this.editcolumn.systemType = 3;
          }

          // console.log(JSON.stringify(searchstr))
          updateColumnByModules(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "更新成功",
                type: "success"
              });
              this.editcolumnVisible = false;
              this.getcolumnlist();
            } else {
              this.$message.error("更新失败");
            }
          });
        }
      });
    },
    savecolumndata() {
      //添加栏目数据
      var form = "column";
      this.$refs[form].validate(valid => {
        if (valid) {
          this.column.navId = this.modulesid;
          // this.column.orgIds = "";
          this.listQuery.orgId = this.$store.getters.orgId;

          this.column.orgIds = this.$refs.treeOne.getCheckedKeys();

          this.column.crtUser = "";
          if (this.column.status != "1") {
            this.column.status = "0";
          }
          compositeSelect(this.listQuery).then(response => {
            this.list = response.data.data.records;
            this.total = response.data.data.count;
            this.listLoading = false;
            // this.listQuery.condition.status.type = 'EQ'
          });

          this.column.appNormalCategoryInsertInputBean = {
            moudlename: this.column.moudlename,
            name: this.column.name,
            code: this.column.code,
            level: 1,
            icon: "",
            url: this.column.url,
            orders: this.column.orders,
            type: this.column.type,
            description: this.column.description,
            alias: this.column.alias,
            systemId: this.systemid,
            status: this.column.status,
            crtUser: "admin",
            image: this.column.image
          };
          if (this.activeName === "newspaper") {
            this.column.appNormalCategoryInsertInputBean.systemType = 5;
          }
          if (this.activeName === "app") {
            this.column.appNormalCategoryInsertInputBean.systemType = 1;
          }
          if (this.activeName === "weChat") {
            this.column.appNormalCategoryInsertInputBean.systemType = 2;
          }
          if (this.activeName === "microBlog") {
            this.column.appNormalCategoryInsertInputBean.systemType = 4;
          }
          if (this.activeName === "website") {
            this.column.appNormalCategoryInsertInputBean.systemType = 3;
          }
          // console.log(JSON.stringify(this.column))
          addColumnByModules(this.column).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "新增成功",
                type: "success"
              });
              this.columnVisible = false;
              this.getcolumnlist();
              this.column.name = "";
              this.column.alias = "";
              this.column.description = "";
              this.column.orders = "";
              this.column.type = "";
              this.column.code = "";
              this.column.url = "";
              this.column.status = "";
              this.column.customizable = "";
              this.column.defaultDisp = "";
              this.column.orgIds = [];
              //清空运营人员
              this.$refs.treeOne.setCheckedNodes([]);
            } else {
              this.$message.error("新增失败");
            }
          });
        }
      });
    },
    deletecolumndata(id) {
      //删除栏目
      let searchstr = {
        id: id
      };
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          deleteColumnByModules(searchstr).then(response => {
            if (response.data.statusCode === 200) {
              this.$message({
                message: "删除成功",
                type: "success"
              });
              this.getcolumnlist();
            } else {
              this.$message.error("删除失败");
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    saveData() {
      //新增站点
      if (this.activeName === "newspaper") {
        var form = "newspaper";
        this.$refs[form].validate(valid => {
          if (valid) {
            this.newspaper.orgId = this.selectItem.selectOuinfoId;
            this.newspaper.orgIds = this.$refs.treeTwo.getCheckedKeys();
            this.newspaper.orgIds.push(this.newspaper.orgId);
            this.arrvaluetwo = this.newspaper.orgIds;
            this.newspaper.crtUser = "";
            // 添加绑定流程
            this.newspaper.auditType = this.auditType;
            newspaperNew(this.newspaper).then(response => {
              if (response.data.statusCode === 200) {
                this.$message({
                  message: "新增成功",
                  type: "success"
                });
                Bus.$emit("newspaperList");
                this.newspaper = {};

                //清空运营人员
                this.$refs.treeTwo.setCheckedNodes([]);
                this.dialogVisible = false;
              } else {
                this.$message.error("新增失败");
              }
            });
          }
        });
      } else if (this.activeName === "app") {
        let form = "app";
        this.$refs[form].validate(valid => {
          if (valid) {
            this.app.orgId = this.selectItem.selectOuinfoId;
            this.app.orgIds = this.$refs.treeTwo.getCheckedKeys();
            this.app.orgIds.push(this.app.orgId);
            this.app.crtUser = "";
            // 添加绑定流程
            this.app.auditType = this.auditType;
            appNew(this.app).then(response => {
              if (response.data.statusCode === 200) {
                this.$message({
                  message: "新增成功",
                  type: "success"
                });
                Bus.$emit("appList");
                this.app = {};
                //清空运营人员
                this.$refs.treeTwo.setCheckedNodes([]);
                this.dialogVisible = false;
              } else {
                this.$message.error("新增失败");
              }
            });
          }
        });
      } else if (this.activeName === "weChat") {
        let form = "weChat";
        this.$refs[form].validate(valid => {
          if (valid) {
            this.weChat.orgId = this.selectItem.selectOuinfoId;
            this.weChat.orgIds = this.$refs.treeTwo.getCheckedKeys();
            this.weChat.orgIds.push(this.weChat.orgId);
            this.weChat.crtUser = "";
            // 添加绑定流程
            this.weChat.auditType = this.auditType;
            weChatNew(this.weChat).then(response => {
              if (response.data.statusCode === 200) {
                this.$message({
                  message: "新增成功",
                  type: "success"
                });
                Bus.$emit("weChatList");
                this.weChat = {};
                this.weChatIs = false;
                this.$refs.updatawc.clearFiles();

                //清空运营人员
                this.$refs.treeTwo.setCheckedNodes([]);
                this.dialogVisible = false;
              } else {
                this.$message.error("新增失败");
              }
            });
          }
        });
      } else if (this.activeName === "microBlog") {
        let form = "microBlog";
        this.$refs[form].validate(valid => {
          if (valid) {
            this.microBlog.orgId = this.selectItem.selectOuinfoId;
            this.microBlog.orgIds = this.$refs.treeTwo.getCheckedKeys();
            this.microBlog.orgIds.push(this.microBlog.orgId);
            this.microBlog.crtUser = "";
            // 添加绑定流程
            this.microBlog.auditType = this.auditType;
            microBlogNew(this.microBlog).then(response => {
              // console.log(this.microBlog)

              if (response.data.statusCode === 200) {
                this.$message({
                  message: "新增成功",
                  type: "success"
                });
                Bus.$emit("microBlogList");
                this.microBlog = {};
                this.microBlogIs = false;
                this.$refs.updataml.clearFiles();
                //清空运营人员
                this.$refs.treeTwo.setCheckedNodes([]);
                this.dialogVisible = false;
              } else {
                this.$message.error("新增失败");
              }
            });
          }
        });
      } else if (this.activeName === "website") {
        let form = "webSite";
        this.$refs[form].validate(valid => {
          if (valid) {
            this.webSite.orgId = this.selectItem.selectOuinfoId;
            this.webSite.orgIds = this.$refs.treeTwo.getCheckedKeys();
            this.webSite.orgIds.push(this.webSite.orgId);
            this.webSite.crtUser = "";
            // 添加绑定流程
            this.webSite.auditType = this.auditType;
            webSiteNew(this.webSite).then(response => {
              if (response.data.statusCode === 200) {
                this.$message({
                  message: "新增成功",
                  type: "success"
                });
                Bus.$emit("websiteList");
                this.webSite = {};
                //清空运营人员
                this.$refs.treeTwo.setCheckedNodes([]);
                this.dialogVisible = false;
              } else {
                this.$message.error("新增失败");
              }
            });
          }
        });
      }
    },
    handleNodeClick(data, node) {
      this.selectItem.orgName = data.name;
      let myArr = [
        {
          name: data.name,
          id: data.id
        }
      ];
      Bus.$emit("dataName", myArr);
      this.selectItem.selectOuinfoId = data.id;
    },
    handleCreate() {
      this.dialogVisible = true;
      this.newspaper = {};
      this.app = {};
      this.weChat = {};
      this.microBlog = {};
      this.webSite = {};
      this.$nextTick(() => {
        //等待dom同步后打开模态框
        //此方法需要模态框加载完成后才可以执行
        if (this.activeName === "newspaper") {
          //报纸
          let form = "newspaper";
          this.$refs[form].clearValidate();
        } else if (this.activeName === "app") {
          //app
          let form = "app";
          this.$refs[form].clearValidate();
        } else if (this.activeName === "weChat") {
          //微信
          let form = "weChat";
          this.$refs[form].clearValidate();
        } else if (this.activeName === "microBlog") {
          //微博
          let form = "microBlog";
          this.$refs[form].clearValidate();
        } else {
          //网站
          let form = "webSite";
          this.$refs[form].clearValidate();
        }
      });
      // this.getTree();
    },
    getTree() {
      this.loading = true;
      const id = {
        id: this.$store.getters.orgId
      };
      getOrgTree(id).then(response => {
        this.treeData = response.data.data;
        // 默认给个组织机构ID
        let self = this;
        this.selectItem.selectOuinfoId = this.treeData[0].id;

        this.loading = false;
      });
    },

    tabClick(tab) {
      console.log("hahah", tab.label);
      this.newName = tab.label;
    },
    handleAvatarSuccess(res, file) {
      console.log("微信子女增", res.data);
      this.weChat.headImg = res.data;
      this.weChatIs = true;
    },
    microBlogSuccess(res, file) {
      this.microBlog.headpic = res.data;
      this.microBlogIs = true;
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === "image/jpeg";
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG) {
        this.$message.error("上传头像图片只能是 JPG 格式!");
      }
      if (!isLt2M) {
        this.$message.error("上传头像图片大小不能超过 2MB!");
      }
      return isJPG && isLt2M;
    }
  }
};
</script>

<style scoped>
.dateInput .el-input {
  width: 100%;
}
.el-checkbox:first-child {
  margin-left: 30px;
}
.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.trees .el-tree-node__content {
  height: 45px;
}

.box-card {
  width: 100%;
}

.el-button--mini,
.el-button--mini.is-round {
  padding: 3px 5px;
}

.list-content {
  min-height: 510px;
  height: 510px;
  /* overflow: hidden; */
  padding: 0px;
  overflow-y: scroll;
  border-bottom: none;
  border-radius: 5px;
  background: #fff;
  /* background: red; */
}

.list-item {
  padding: 4px 2px;
  border-radius: 5px;
  border: 1px #eeeeee solid;
}

.lists {
  margin-right: 5px;
  text-align: right;
}

.list-item .list-title {
  margin-left: 10px;
  float: left;
  width: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.list-item.active {
  /* background-color: #ddd; */
  background: #ecf5ff;
  border-radius: 5px;
}

.p-l {
  float: right;
}
</style>
